<template>
  <view class="main">
    <view class="header"></view>
    <view class="mainBox">
      <image
        src="https://qianjin-file.oss-cn-beijing.aliyuncs.com/app/static/success.png"
        alt=""
      />
      <view class="bottomBox">
        <text>活动时间：{{ route?.startTime }}</text>
        <button @click="orderDetail">查看预约信息</button>
        <button class="back" @click="backHomePage">返回首页</button>
      </view>
    </view>
  </view>
</template>

<script setup>
import { onMounted, ref } from "vue";
// import { useRouter, useRoute } from "vue-router";

// const router = useRouter()
const route = ref();

	onMounted(() => {
		route.value = getCurrentPages()[2].options
	})

const backHomePage = () => {
  router.push({
    name: "Home",
  });
};
const orderDetail = () => {
  // router.push({
  //   name: "OrderDetail",
  //   query: {
  //     activeOrderId: route.query.activeOrderId,
  //   },
  // });
  uni.navigateTo({
      url: 'orderDetail?activeOrderId='+route.value.activeOrderId
  })
};
</script>

<style lang="scss" scoped>
.main {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  align-items: center;
  width: 100vw;
  height: 100vh;
  background-color: $sys_theme;
    color: $color-text;
  .header {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: absolute;
    top: 0;
    z-index: 99999999;
    height: 9.61vh;
    width: 100%;
  }
  .mainBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    box-sizing: border-box;
    height: 49.26vh;
    width: 100%;
    padding: 0 23.47vw;
    image {
		height: 13.12vh;
      width: 100%;
    }
    .bottomBox {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      height: 13.36vh;
      width: 100%;
      margin-top: 2.15vh;
      text {
        font-size: $font-size-small-s;
      }
      .back {
        background-color: $sys_theme;
        color: $color-text;
        border: 2px solid $color-text;
      }
    }
    button {
		display: flex;
		align-items: center;
		justify-content: center;
      width: 100%;
      height: 3.63vh;
      border-radius: 0.625rem;
      background-color: $color-text;
      border: 0;
      color: $sys_theme;
      font-size: $font-size-small;
      border-radius: 5.07vw;
    }
  }
}
</style>